import React, { Component } from 'react';
import { Link, routerRedux } from 'dva/router';
import { connect } from 'dva';
import { List, InputItem,  Toast, Flex,Icon,WingBlank,Button,Grid} from 'antd-mobile';
import NavTopBar from '../../components/NavTopBar/NavTopBar';
import select2 from '../../assets/img/select2.svg';
import select1 from '../../assets/img/select1.svg';
// import Img from "../../components/Img/Img";
import titlesvg from "../../assets/img/title.svg";
import paySuccesssvg from "../../assets/img/paySuccess.svg";
import MyScroll from "../../components/MyScroll/MyScroll";
import RecommendGoods from "../../components/RecommendGood/RecommendGoods";

const {Item} =List;

class PaySuccess extends Component {
    constructor(props) {
        super(props);
        this.state={

        }
    }

    componentWillMount(){
        this.props.dispatch({type:"orderList/RecommendsEFF"})
    }


    render() {
        console.log(this.props,"this.props_paySuccess")
        const {dispatch} =this.props;
        const {list=[]} = this.props.orderList;

        // 是否为支付
        let isPay = this.props.match.params.data.split(",")[2][0].toUpperCase() == 'P';
        let paytype=this.props.match.params.data.split(",")[3] || 1;//支付方式 1 在线支付 2 货到付款

        console.log('是否为支付', isPay)
        return (
            <Flex style={{
                height:"100%",
                width:"100%"
            }} direction="column"
            >
                <NavTopBar dispatch={dispatch} title={isPay ? (paytype == 1 ? '支付成功':'支付成功') : '充值成功'} noBack={true}/>
                <MyScroll>
                    <div style={{backgroundColor:"#fff"}}>
                        <Flex justify="center">
                            <Icon type={paySuccesssvg.id} style={{width:"1rem",height:"1rem",marginRight:".2rem"}}/>
                            <div style={{padding:".4rem 0"}}>
                                <p style={{marginBottom:".3rem", fontSize: '.24rem'}}>{ isPay ? `订单编号: ${this.props.match.params.data.split(",")[1]}` : '充值成功' }</p>
                                <p style={{fontSize: '.24rem'}}>{ isPay ? (paytype == 1 ? '支付金额' : '货到付款') : '充值金额' } : <span style={{color:"#ff0036"}}>¥{this.props.match.params.data.split(",")[0]}</span></p>
                            </div>
                        </Flex>


                        <Flex justify="around" style={{paddingBottom:".4rem"}}>
                            <div  style={{padding:".15rem .4rem",border:"1px solid #000",borderRadius:"50px"}} onClick={()=>{
                                this.props.dispatch(routerRedux.push({
                                    pathname:`/`
                                }))
                            }}>返回首页</div>
                            {
                                isPay
                                ? <div style={{padding:".15rem .4rem",border:"1px solid #ff0036",borderRadius:"50px",color:"#ff0036"}} onClick={() => this.props.dispatch(routerRedux.push({pathname:`/orderList/0`}))}>查看订单</div>
                                : <div style={{padding:".15rem .4rem",border:"1px solid #ff0036",borderRadius:"50px",color:"#ff0036"}} onClick={() => this.props.dispatch(routerRedux.push({pathname:`/my`}))}>个人中心</div>

                            }
                        </Flex>
                    </div>
                    <RecommendGoods data={list} dispatch={dispatch}/>
                </MyScroll>

            </Flex>
        );
    }
}

export default connect(({ orderList }) => ({ orderList }))(PaySuccess);
